<template>
  <pageTabelLayout>
    <template #pageHeader>
      <!-- 新增计划订单 -->
      <div class="my-header">
        <div style="height: 24px;width: 100%;border-bottom: 1px solid #e5e7eb; margin-bottom: 15px;"></div>
        <div class="search-form" v-if="headerShow">
          <a-form :model="fromList" size="mini">
            <a-row class="grid-demo" :style="{ height: '30px' }">
              <a-col :span="6">
                <a-form-item field="endTime" label="下单日期：" label-col-flex="110px">
                  <!-- <a-date-picker  popup-container="html"  v-model="fromList.endTime" style="width: 200px;" /> -->
                  <a-range-picker popup-container="html" class="bacClass" @change="onChange" @select="onSelect"
                                  style="width: 270px; marginBottom: 20px;"/>
                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="orderCode" label="染整单号：" label-col-flex="110px">
                  <!-- <a-input v-model="fromList.ColorId" /> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch"
                            v-model="fromList.orderCode" :filter-option="false" allow-search
                            @focus="focusSel(1)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option v-for="item in pageDataList" :label="item.clientDyeCode"
                              :value="item.clientDyeCode">{{ item.clientDyeCode }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="customName" label="客户名称：" label-col-flex="110px">
                  <!-- <a-input v-model="fromList.ColorName" /> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch"
                            v-model="fromList.customName" :filter-option="false" allow-search
                            @focus="focusSel(2)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option v-for="item in pageDataList" :label="item.customName"
                              :value="item.customName">{{ item.customName }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="clothCode" label="成品布号：" label-col-flex="110px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.customName" allow-clear>
                      <a-option v-for="item of basicData.custom" :value="item.id" :key="item.id"
                          :label="item.customName" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearchBh" v-model="fromList.clothCode" :filter-option="false"
                            allow-search @focus="focusSelBh" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option v-for="item in pageDataList" :label="item.finishedClothCode"
                              :value="item.finishedClothCode">{{ item.finishedClothCode }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
            </a-row>
            <a-row class="grid-demo" :style="{ height: '30px' }">
              <a-col :span="6">
                <a-form-item field="startDeliveryTime" label="交货日期：" label-col-flex="110px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.clientDyeCode" allow-clear>
                  </a-select> -->
                  <a-range-picker popup-container="html" class="bacClass" @change="onChangeDelivery"
                                  @select="onSelectDelivery"
                                  style="width: 270px; marginBottom: 20px;"/>
                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="customOrderCode" label="客订单号:" label-col-flex="110px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.genDanCode" allow-clear>
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch"
                            v-model="fromList.customOrderCode" :filter-option="false" allow-search
                            @focus="focusSel(3)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }" @change="selectChange">
                    <a-option v-for="item in pageDataList" :label="item.customOrderCode"
                              :value="item.customOrderCode">{{ item.customOrderCode }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="customOrderName" label="客订名称：" label-col-flex="110px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.dyType" allow-clear>
                      <a-option v-for="item of basicData.orderNature" :value="item.id" :key="item.id"
                          :label="item.detailName" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch"
                            v-model="fromList.customOrderName" :filter-option="false" allow-search
                            @focus="focusSel(4)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option v-for="item in pageDataList" :label="item.customOrderName"
                              :value="item.customOrderName">{{ item.customOrderName }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="greyCode" label="坯布编号：" label-col-flex="110px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.account" allow-clear>
                      <a-option v-for="item of basicData.hrEmployee" :value="item.id" :key="item.id"
                          :label="item.text" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearchSh" v-model="fromList.greyCode" :filter-option="false"
                            allow-search @focus="focusSelSh(1)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option v-for="item in pageDataList" :label="item.clothCode"
                              :value="item.clothCode">{{ item.clothCode }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
            </a-row>
            <a-row class="grid-demo" :style="{ height: '30px' }">

              <a-col :span="6">
                <a-form-item field="colorCode" label="色号：" label-col-flex="110px" style="height:52px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.clientDyeCode" allow-clear>

                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearchSh" v-model="fromList.colorCode" :filter-option="false"
                            allow-search @focus="focusSelSh(1)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }" @change="selectChange">
                    <a-option v-for="item in pageDataList" :label="item.colorCode"
                              :value="item.colorCode">{{ item.colorCode }}
                    </a-option>
                  </a-select>

                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="colorName" label="色称：" label-col-flex="110px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.genDanCode" allow-clear>

                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch"
                            v-model="fromList.colorName" :filter-option="false" allow-search
                            @focus="focusSelSh(2)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }" @change="selectChange">
                    <a-option v-for="item in pageDataList" :label="item.colorName"
                              :value="item.colorName">{{ item.colorName }}
                    </a-option>
                  </a-select>

                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="orderNature" label="订单性质：" label-col-flex="110px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.dyType" allow-clear>
                      <a-option v-for="item of basicData.orderNature" :value="item.id" :key="item.id"
                          :label="item.detailName" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch"
                            v-model="fromList.orderNature" :filter-option="false" allow-search
                            @focus="focusSel(5)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }" @change="selectChange">
                    <a-option v-for="item in pageDataList" :label="item.orderNature"
                              :value="item.orderNature">{{ item.orderNature }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>

              <a-col :span="6">
                <a-form-item field="quickReturnState" label="急单快反：" label-col-flex="110px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.dyType" allow-clear>
                      <a-option v-for="item of basicData.orderNature" :value="item.id" :key="item.id"
                          :label="item.detailName" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :style="{ width: '320px' }"
                            v-model="fromList.quickReturnState" style="width:270px">
                    <a-option value=0>是</a-option>
                    <a-option value=1>否</a-option>
                  </a-select>
                </a-form-item>
              </a-col>
            </a-row>
            <a-row class="grid-demo" :style="{ height: '30px' }">
              <a-col :span="6">
                <a-form-item field="craftCode" label="工艺性质：" label-col-flex="110px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.account" allow-clear>
                      <a-option v-for="item of basicData.hrEmployee" :value="item.id" :key="item.id"
                          :label="item.text" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch"
                            v-model="fromList.craftCode" :filter-option="false" allow-search
                            style="width:270px;" :trigger-props="{ autoFitPopupMinWidth: true }"
                            @change="selectChange" @focus="focusSel(6)">
                    <a-option v-for="item in pageDataList" :label="item.placeDepartment"
                              :value="item.placeDepartment">{{ item.placeDepartment }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>

              <a-col :span="6">
                <a-form-item field="workshop" label="生产车间：" label-col-flex="110px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.dyType" allow-clear>
                      <a-option v-for="item of basicData.orderNature" :value="item.id" :key="item.id"
                          :label="item.detailName" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :style="{ width: '320px' }"
                            v-model="fromList.workshop"
                            style="width:270px">
                    <a-option value="ok">已开齐</a-option>
                    <a-option value="Y1">待开单：有坯布未开齐</a-option>
                    <a-option value="Y2">欠坯：没有坯布库存</a-option>
                  </a-select>
                </a-form-item>
              </a-col>

              <a-col :span="6">
                <a-form-item field="holdState" label="HOLD单：" label-col-flex="110px">
                  <a-select popup-container="html" class="bacClass" :style="{ width: '320px' }"
                            v-model="fromList.holdState"
                            style="width:270px">
                    <a-option value=0>是</a-option>
                    <a-option value=1>否</a-option>
                  </a-select>

                </a-form-item>
              </a-col>

              <a-col :span="6">
                <a-form-item field="cards" label="已下流转卡号:" label-col-flex="110px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.account" allow-clear>
                      <a-option v-for="item of basicData.hrEmployee" :value="item.id" :key="item.id"
                          :label="item.text" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch"
                            v-model="fromList.cards" :filter-option="false" @focus="focusSelLz"
                            style="width:270px;" :trigger-props="{ autoFitPopupMinWidth: true }" multiple>
                    <a-option v-for="item in pageDataList" :label="item.flowCardCode"
                              :value="item.flowCardCode">{{ item.flowCardCode }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>


            </a-row>

          </a-form>
        </div>

        <div class="my-divisders">
          <a-divider orientation="center">
            <icon-double-up v-if="headerShow" @click="headerShow = false" :strokeWidth="2" :size="18"/>
            <icon-double-down v-else @click="headerShow = true" :strokeWidth="2" :size="18"/>
          </a-divider>
        </div>
        <div class="my-tool-bar">
          <div class="bg-container-1">
            <div>
              <!-- <el-button type="primary" :icon="Search" class="stbutencx" @click="selectHandler">查询</el-button>
              <el-button type="success" :icon="CirclePlus" class="stbutenxz" @click="addHandler">刷新订单</el-button>
              <el-button plain :icon="Delete" @click="billing">开单</el-button> -->
              <el-button type="primary" :icon="Search" class="stbutencx" @click="selectHandler">查询</el-button>
              <el-button type="primary" :icon="Search" class="stbutencx"
                         @click="HOLDState(1)">HOLD单
              </el-button>
              <el-button type="primary" :icon="Search" class="stbutencx"
                         @click="HOLDState(0)">取消HOLD单
              </el-button>
              <el-button type="primary" :icon="Search" class="stbutencx" @click="workshop">车间调整</el-button>
              <el-button type="primary" :icon="Search" class="stbutencx" @click="flowPath">流程调整</el-button>
              <el-button type="primary" :icon="Search" class="stbutencx" @click="billing(1)">合染</el-button>
              <el-button type="primary" :icon="Search" class="stbutencx" @click="billing(0)">取消合染</el-button>
            </div>
          </div>
        </div>
      </div>
    </template>
    <template #pageTabel>
      <a-tabs   :lazy-load="true" default-active-key="0" @change="changeGet">
        <a-tab-pane key="0" title="流转卡管理">
          <!-- <AgGridVuesCopys style="height:72vh;" class="ag-theme-alpine " :columnDefs="tc"
              :rowData="tableCon.tableConter" :defaultColDef="defaultColDef" rowSelection="multiple"
              @grid-ready="gridReady" :enableColResize="true">
          </AgGridVuesCopys> -->
          <AgGridVuesCopys style="height:calc(100% - 90px)" class="ag-theme-alpine" :columnDefs="tc"
                           :rowData="tableCon.tableConter" :defaultColDef="defaultColDef" rowSelection="multiple"
                           @grid-ready="gridReady" :localeText="localeText1" :suppressCopyRowsToClipboard="true">
          </AgGridVuesCopys>
          <paginationCopys :total="paging.total" :page-size="paging.size" v-model:current='pages' show-page-size
                           show-total show-jumper
                           size="mini" @change="pagingChange" @page-size-change="pagingSizeChange"/>
        </a-tab-pane>
      </a-tabs>
    </template>
    <a-drawer :drawer-style="{ 'zIndex': 9999 }" title="开单详情" placement="bottom" :mask-closable="false" width="100"
              height="100%" :visible="pageData.importAdd" unmountOnClose @ok="sideaOk" @cancel="sideaNo"
              cancel-text='关闭'
              ok-text='保存'>

      <template #title>
        <!-- <div style="position: absolute; right: 50px;"> -->
        <!-- <Toolbar :items="['查询 ', '确定', 'Excel资料导入', '导出']" @add="addHandler" @import="importHandler"
                @del="deleteHandler" @select="selectHandler" @export="exports" @excel="downloadHandler">
            </Toolbar> -->
        <!-- <el-button plain :icon="Search" @click="guanxiCount">刷新</el-button> -->
        <!-- <el-button plain @click="yesOrder">确定</el-button> -->
        <!-- </div> -->
        <div style="position: absolute; right: 50px;">
          <a-space>
            <a-button type="outline" @click="guanxiCount">刷新</a-button>
          </a-space>
        </div>


        <div class="my-tool-bar">
          合染
          <!-- <el-button type="primary" :icon="CirclePlus" class="stbutencx"
              @click="importHandler">导入后台巨客户</el-button> -->
          <!-- <el-button type="primary" :icon="CirclePlus" class="stbutencx"
              @click="importHandler">导入后台巨客户按钮</el-button> -->
          <!-- <el-button type="primary" :icon="CirclePlus" class="stbutencx" @click="downloadHandler">模板下载</el-button>
          <el-button type="primary" :icon="CirclePlus" class="stbutencx" @click="yesOrder">确定</el-button> -->
        </div>
      </template>
      <div>
        <a-form :model="guanxiForm">
          <a-row :gutter="16">
            <a-col :span="4">
              <a-form-item field="clothCode" label="缸型:" label-col-flex="110px">
                <!-- <el-select v-model="guanxiForm.clothCode" filterable @click="selectChange">
                    <el-option v-for="item in optionsList" :key="item.id" :label="item.clothCode"
                        :value="item.clothCode" />
                </el-select> -->
                <a-select popup-container="html" :style="{ width: '320px' }" v-model="basicData.dyeList.vatType"
                          style="width:270px">
                  <a-option value='E缸'>E缸</a-option>
                  <a-option value='S缸'>S缸</a-option>
                </a-select>
              </a-form-item>
            </a-col>
            <a-col :span="4">
              <a-form-item field="productName" label="车间:" label-col-flex="110px">
                <!-- <el-select v-model="guanxiForm.productName" filterable @click="selectPin">
                    <el-option v-for="item in pinList" :key="item.id" :label="item.brandName"
                        :value="item.brandName" />
                </el-select> -->
                <a-select popup-container="html" :style="{ width: '320px' }" v-model="basicData.dyeList.tubeType"
                          style="width:270px">
                  <a-option value='染部A'>染部A</a-option>
                  <a-option value='染部B'>染部B</a-option>
                </a-select>
              </a-form-item>
            </a-col>
          </a-row>
        </a-form>
      </div>
      <div style="height:15px;"></div>
      <a href="#" style="color:blue"></a>
      <div style="height:10px;"></div>

      <a-tabs   :lazy-load="true" default-active-key="1" @change="mobanYn">
        <a-tab-pane key="1" title="">
          <AgGridVuesCopys style="height:32vh;" class="ag-theme-alpine" :columnDefs="hugeCustomer"
                           :rowData="orderCustomList.list" :defaultColDef="defaultColDefBc" rowSelection="multiple"
                           :localeText="localeText1" :suppressCopyRowsToClipboard="true">
          </AgGridVuesCopys>

          <AgGridVuesCopys style="height:32vh;" class="ag-theme-alpine" :columnDefs="hugeCustomerS"
                           :rowData="orderCustomList.list" :defaultColDef="defaultColDefBc" rowSelection="multiple"
                           :localeText="localeText1" :suppressCopyRowsToClipboard="true">
          </AgGridVuesCopys>
        </a-tab-pane>
      </a-tabs>

    </a-drawer>
    <a-drawer :drawer-style="{ 'zIndex': 9999 }" title="流程调整" placement="bottom" :mask-closable="false" width="100"
              height="100%" :visible="pageData.importPath" unmountOnClose @ok="sideaPathOk" @cancel="sideaPathNo"
              cancel-text='关闭' ok-text='保存'>


      <AgGridVuesCopys style="height:80%;" class="ag-theme-alpine" :columnDefs="flowPathList" @grid-ready="gridReady2"
                       :rowData="orderCustomList.flowPathList" :defaultColDef="defaultColDefBc" rowSelection="multiple"
                       :localeText="localeText1" :suppressCopyRowsToClipboard="true">
      </AgGridVuesCopys>


    </a-drawer>
    <el-dialog v-model="pageData.dialogVisible" title="流转卡" width="20%" :before-close="handleClose">
      <QrcodeVue :value="pageData.flowCardCode" :size="300"></QrcodeVue>
      <template #footer>
                <span class="dialog-footer">
                    <el-button @click="pageData.dialogVisible = false">关闭</el-button>
                </span>
      </template>
    </el-dialog>
    <el-dialog v-model="cjtzShow" title="车间调整" width="30%">
      <div style="display:flex">
        <div style="width:80px;line-height: 2;">选择车间</div>
        <a-select popup-container="html" class="bacClass" :allowClear="true" v-model="cjtzZ" allow-search>
          <a-option value="染部A">染部A</a-option>
          <a-option value="染部B">染部B</a-option>
        </a-select>
      </div>
      <template #footer>
                <span class="dialog-footer">
                    <el-button @click="cjtzShow = false">关闭</el-button>
                    <el-button @click="cjtzClick">确定</el-button>
                </span>
      </template>
    </el-dialog>
  </pageTabelLayout>
</template>
<script lang="ts">
import {post, get} from "@/api/http";
import {Search, CirclePlus, Delete, EditPen} from "@element-plus/icons-vue";
// import {
//     useTable,
//     useRowKey,
//     useTableColumn,
//     usePagination,
//     useRowSelection,
// } from "@/hooks/table";
import stainResistance from '@/views/Aps/planOrderA/cheCkBoxComm/stainResistance.vue'
import rcInfo from '@/views/Aps/planOrderA/cheCkBoxComm/rcInfo.vue'
import wetRubbing from '@/views/Aps/planOrderA/cheCkBoxComm/wetRubbing.vue'
import resistanceYellow from '@/views/Aps/planOrderA/cheCkBoxComm/resistanceYellow.vue'
import quickReturnState from '@/views/Aps/planOrderA/cheCkBoxComm/quickReturnState.vue'
import cheCkHold from '@/views/Aps/planOrderA/cheCkBoxComm/cheCkHold.vue'
import cheCkTogetherState from '@/views/Aps/planOrderA/cheCkBoxComm/cheCkTogetherState.vue'
import cheCkBumpWhite from '@/views/Aps/planOrderA/cheCkBoxComm/cheCkBumpWhite.vue'
import cheCKSensitiveColor from '@/views/Aps/planOrderA/cheCkBoxComm/cheCKSensitiveColor.vue'
import textClothRequires from '@/views/Aps/planOrderA/selectList/textClothRequires.vue'
import {localeText} from '@/api/aggridZw'
import {useRouter} from 'vue-router';
import {ref, reactive, onMounted, onActivated, onUnmounted, watch} from "vue";
// import Toolbar from "@/components/Toolbar.vue";
import {Form, Message, Modal, Pagination} from "@arco-design/web-vue";

// import { FormInstance } from "@arco-design/web-vue/es/form";
// import emitter from "@/hooks/useEventBus";
// import validate from "@/hooks/useValidate";
//import { baseURL } from '../../../api/axios.config'
// import axios from "axios";
// import filedownload from 'js-file-download'
import "ag-grid-community/styles/ag-grid.css";
import "ag-grid-community/styles/ag-theme-alpine.css";
import {} from "ag-grid-vue3";
import QrcodeVue from 'qrcode.vue'
//import aag from "./AGbut"
//import aag from "./agbuut.vue"
interface ClothSet {
  id?: any;
  serialNumber?: number | undefined,
  mercery?: string | undefined;
  deleteState?: any
  remark?: string | undefined;
  productionMode?: string | undefined;
  createName?: string | undefined;
  createTime?: string | undefined;
  updateName?: string | undefined;
  updateTime?: string | undefined;
}

interface pagings {
  size: number | string,
  total: number | string,
}

export default {
  name: "productionMode",
  setup() {
    const headerShow = ref<boolean>(true)
    const pages = ref(1);
    const pageData = reactive<{
      clothList: ClothSet[]
      showAdd: boolean
      sideTitle: string
      dropDownData: any
      pageLoading: boolean,
      theight: number,
      tablediv: any,
      rHeight: number | undefined,
      importAdd: boolean,
      importPath: boolean,
      flowCardCode: string,
      dialogVisible: boolean
    }>({
      clothList: [],
      showAdd: false,
      sideTitle: "计划订单",
      dropDownData: "",
      pageLoading: false,
      theight: 0,
      tablediv: null,
      rHeight: 0,
      importAdd: false,
      importPath: false,
      flowCardCode: '',
      dialogVisible: false
    });
    const paging: pagings = reactive({
      size: 10,
      total: 30,
    })
    let shen = ref(0);
    const tableCon = reactive({
      tableConter: [],
    });
    const tableConA = reactive({
      tableConter: [],
    });
    const clothCode = reactive({
      clothCode: '',
      productName: ''
    })
    //待处理/已处理 表头
    let columnDefs = [
      {
        rowHeight: 100,
        headerName: '',//选择列头部显示的文字，可以为空
        checkboxSelection: true,//设置为ture显示为复选框
        headerCheckboxSelection: true, //表头是否也显示复选框，全选反选用
        pinned: 'left', //固定再左边
        width: 50 //列的宽度
      },
      {headerName: "HOLD单状态", field: "holdState",},
      {headerName: "快反急单状态", field: "quickReturnState"},
      {headerName: "开单日期", field: "createOrderTime"},
      {headerName: "缸型", field: "cylinderType",},
      {headerName: "管型", field: "castNum"},

      {headerName: "缸位", field: "machineCode"},
      {headerName: "合缸状态", field: "togetherState",},
      {headerName: "合缸缸号", field: "togetherCode"},
      {headerName: "生产车间", field: "workshop"},
      {headerName: "色样", field: "colorSample",},
      {headerName: "流转卡号", field: "flowCardCode"},
      {headerName: "布号", field: "clothCode"},
      {headerName: "品号", field: "productName",},
      {headerName: "色号", field: "colorCode"},
      {headerName: "色称", field: "colorName"},
      {headerName: "匹数", field: "houseNum",},
      {headerName: "重量", field: "flowCardWeight"},
      {headerName: "撞白", field: "bumpWhite"},
      {headerName: "一等品", field: "firstRate",},

      {headerName: "印花", field: "workshop"},
      {headerName: "白色防粘处理", field: "stainResistance",},
      {headerName: "白色RC处理", field: "rcInfo",},
      {headerName: "湿擦提升", field: "wetRubbing"},
      {headerName: "抗黄处理", field: "resistanceYellow"},
      {headerName: "染色类型", field: "dyeingType"},

      {headerName: "工艺类型", field: "craftCode",},
      {headerName: "布种类别", field: "greyType"},
      {headerName: "颜色深浅", field: "colorDepth"},
      {headerName: "敏感色", field: "sensitiveColor"},
      {headerName: "色样要求", field: "colorSampleRequire",},
      {headerName: "客户要求", field: "customeRequire"},

      {headerName: "客户名称", field: "customName",},
      {headerName: "客订名称", field: "customOrderName"},
      {headerName: "染整单号", field: "clientDyeCode"},
      {headerName: "客户订单号", field: "customOrderCode"},
      {headerName: "订单性质", field: "orderNature",},
      {headerName: "商品号", field: "tradeCode"},
      {headerName: "商品名称", field: "tradeName",},
      {headerName: "商品门幅", field: "tradeEfficacious"},
      {headerName: "商品克重", field: "tradeGramWeight"},
      {headerName: "商品色号", field: "tradeColorCode"},
      {headerName: "商品色称", field: "tradeColorName",},
      {headerName: "幅宽", field: "efficacious"},

      {headerName: "克重", field: "gramWeight",},
      {headerName: "定型剪板要求", field: "finalize"},
      {headerName: "坯布编号", field: "greyCode"},
      {headerName: "纱批", field: "yarnBatch"},
      {headerName: "工艺路线", field: "processRoute",},
      {headerName: "定坯", field: "orientStock"},
      {headerName: "烧毛", field: "singeing",},
      {headerName: "长车", field: "longVehicle"},
      {headerName: "拉针机", field: "needleDrawi ng"},
      {headerName: "预缩机", field: "preShrinking"},
      {headerName: "抓毛机", field: "combing",},
      {headerName: "梳剪联机", field: "thinningShearing"},

      {headerName: "摇粒机", field: "craftCode",},
      {headerName: "审核人", field: "greyType"},
      {headerName: "制单人", field: "colorDepth"},
      {headerName: "下单时间", field: "sensitiveColor"},
      {headerName: "开单时间", field: "colorSampleRequire",},
      {headerName: "跟单发单日期", field: "customeRequire"},
      {headerName: "染部收单时间", field: "craftCode",},
      {headerName: "组缸时间", field: "greyType"},
      {headerName: "交货日期", field: "colorDepth"},
      {headerName: "开单用时", field: "sensitiveColor"},
      {headerName: "操作",},
      {headerName: "生成条码"},

    ];
    let ta: any[] = columnDefs.slice(0, 35)
    let tc: any[] = columnDefs.map((o) => {
      //let obj = {}
      if (o.headerName === '操作') {
        o['resizable'] = false
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "right"
        o["width"] = 80
        o['cellRenderer'] = {
          template: `
            <el-button style="color:#165dff;" link @click="a">修改</el-button>`,
          setup(props: any) {
            const a = () => {
              editHandler(props.params.data)
            }
            return {
              a
            }
          }

        }
      }
      if (o.headerName == '生成条码') {
        o['resizable'] = false
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "right"
        o["width"] = 150
        o['cellRenderer'] = {
          template: `
            <el-button type='success' style='background-color: #67c23a :hover {
                        background-color: #b3e19d;
                    }' @click="a">生成条码
            </el-button>`,
          setup(props: any) {
            const a = () => {
              editHandler1(props.params.data)
            }
            return {
              a
            }
          }

        }
      }
      if (o.headerName === 'HOLD单状态') {
        o['resizable'] = true
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "light"
        o["width"] = 150
        o['cellRenderer'] = cheCkHold
        o['cellRendererParams'] = {
          color: (params: any) => {
          }
        }
      }
      if (o.headerName === '快反急单状态') {
        o['resizable'] = true
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "light"
        o["width"] = 150
        o['cellRenderer'] = quickReturnState
        o['cellRendererParams'] = {
          color: (params: any) => {
          }
        }
      }
      if (o.headerName === '白色防粘处理') {
        o['resizable'] = true
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "light"
        o["width"] = 150
        o['cellRenderer'] = stainResistance
        o['cellRendererParams'] = {
          color: (params: any) => {
          }
        }
      }
      if (o.headerName === '白色RC处理') {
        o['resizable'] = true
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "light"
        o["width"] = 150
        o['cellRenderer'] = rcInfo
        o['cellRendererParams'] = {
          color: (params: any) => {
          }
        }
      }
      if (o.headerName === '湿擦提升') {
        o['resizable'] = true
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "light"
        o["width"] = 150
        o['cellRenderer'] = wetRubbing
        o['cellRendererParams'] = {
          color: (params: any) => {
          }
        }
      }
      if (o.headerName === '抗黄处理') {
        o['resizable'] = true
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "light"
        o["width"] = 150
        o['cellRenderer'] = resistanceYellow
        o['cellRendererParams'] = {
          color: (params: any) => {
          }
        }
      }
      if (o.headerName === '合缸状态') {
        o['resizable'] = true
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "light"
        o["width"] = 150
        o['cellRenderer'] = cheCkTogetherState
        o['cellRendererParams'] = {
          color: (params: any) => {
          }
        }
      }
      if (o.headerName === '撞白') {
        o['resizable'] = true
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "light"
        o["width"] = 150
        o['cellRenderer'] = cheCkBumpWhite
        o['cellRendererParams'] = {
          color: (params: any) => {
          }
        }
      }

      if (o.headerName === '一等品') {
        o['resizable'] = true
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "light"
        o["width"] = 150
        o['cellRenderer'] = cheCkBumpWhite
        o['cellRendererParams'] = {
          color: (params: any) => {
          }
        }
      }


      if (o.headerName === '敏感色') {
        o['resizable'] = true
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "light"
        o["width"] = 150
        o['cellRenderer'] = cheCKSensitiveColor
        o['cellRendererParams'] = {
          color: (params: any) => {
          }
        }
      }


      if (o.headerName == '客户要求') {
        o['resizable'] = true
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "light"
        o["width"] = 150
        o['cellRenderer'] = textClothRequires
        o['cellRendererParams'] = {
          color: (params: any) => {
          }
        }
      }
      return o
    })
    const defaultColDef = {
      sortable: true,
      filter: true,
      //  flex: 1,
      resizable: true,
    };
    //查询表单
    const fromList = reactive({
      // page: 1,
      // size: 10,
      startCreateTime: "",        //开单日期开始时间
      endCreateTime: "",          //开单日期结束时间
      startDeliveryTime: "",      //交货日期的开始时间
      endDeliveryTime: "",        //交货日期的结束时间
      quickReturnState: "",        //快反急单
      orderCode: "",              //染整单号
      customOrderCode: "",        //客户订单号
      orderNature: "",            //订单性质
      customName: "",             //客户名称
      customOrderName: "",        //客订名称
      craftCode: "",              //工艺类型
      clothCode: "",              //布号
      greyCode: "",               //坯布编号
      workshop: "",               //车间
      colorCode: "",              //色号
      colorName: "",              //色称
      holdState: '',              //hold单
      cards: []                   //流转卡号
    })

    //下拉框
    const basicData = reactive({
      dyeList: {
        vatType: '',
        tubeType: '',
        startTime: '',
        endTime: ''
      },
      dictTypeList: ['订单性质', '结算方式', '面料销售类型', '结算公司'],
      ProductionMode: [],
      machinType: [],
      ExchangecalorieClassify: [],
      saleType: [],
      labelFormat: [],
      UrgentCategory: [],
      orderNature: [],
      Calculation: [],
      plusMaterial: [],
      corporation: [],
      custom: [],
      hrEmployee: [],
      baCompany: [],
      VerifyStandard: [],
      coloringMatch: [],
      seasonSet: [],
      dyeingList: [],              //染整单号下拉框
    })
    /************************************************************查询************************************************************************************/
        //查询
    const selectHandler = () => {
          pages.value = 1;
          doRefresh();
        }

    function doRefresh() {
      pageData.pageLoading = true
      post({
        url: "/aps/circulatCard/getPage",
        data: {
          page: pages.value,
          size: paging.size,
          ...fromList
        }
      }).then(({data, code}: any) => {
        if (code === 200) {
          //  console.log(data, "结果");
          tableCon.tableConter = data.list;
          tableConA.tableConter = data.list;
          paging.total = data.total;
          //     // pagination.setTotalSize(data.total);
        }
      })
          .catch(console.log).finally(() => {
        pageData.pageLoading = false
      })
    }

    /***************************************************删除***************************************************************************** */
    const trigger = ref('1');
    const gridOption = ref();
    const gridReady = (params: any) => {
      gridOption.value = params.api
    }
    const gridOptionA = ref()
    const gridReadyA = (params: any) => {
      gridOptionA.value = params.api
    }
    const billing = (val: any) => {
      if (gridOption.value.getSelectedRows().length < 2) {
        Message.error('请先勾选两条以上的数据！')
        return;
      }
      if (val == 1) {
        gridOption.value.getSelectedRows().forEach((item: any) => {
          item.togetherState = 1
        })
        Modal.confirm({
          title: '系统提示',
          content: '是否合染',
          onOk() {
            post({
              url: "/aps/circulatCard/devTogether",
              data: gridOption.value.getSelectedRows(),
              // data: [...gridOption.value.getSelectedRows(), { togetherState: 1 }]

            }).then((res: any) => {
              if (res.code === 200) {
                doRefresh();
                Message.success('合染成功')
              } else {
                Message.error(res.message)
              }
            })
          }
        })
      } else {
        gridOption.value.getSelectedRows().forEach((item: any) => {
          item.togetherState = 0
        })
        Modal.confirm({
          title: '系统提示',
          content: '是否取消合染',
          onOk() {
            post({
              url: "/aps/circulatCard/devTogether",
              data: gridOption.value.getSelectedRows()
            }).then((res: any) => {
              if (res.code === 200) {
                doRefresh();
                Message.success('取消合染成功')
              } else {
                Message.error(res.message)
              }
            })
          }
        })
      }

    };
    /*************************************************HOLD订单******************************************************************************* */
    const HOLDState = (val: any) => {
      let arr: any = []
      gridOption.value.getSelectedRows().map((item: any) => {
        arr = [{id: item.id, holdState: val}]
      })
      if (arr.length === 0) {
        Message.warning({
          content: "请选择HOLD单的数据",
          duration: 5000,
        });
        return;
      }
      Modal.confirm({
        title: "系统提示",
        content: "确认HOLD选中的数据?",
        onOk() {
          post({
            url: "/aps/circulatCard/holdInfo",
            data: arr,
          }).then(({code, data, message}: any) => {
            // console.log(code,"删除的状态码")
            if (code === 200) {
              doRefresh();
              if (val == 1) {
                Message.success({
                  content: "HOLD单成功",
                  duration: 5000,
                });
              } else if (val == 0) {
                Message.success({
                  content: "取消HOLD单成功",
                  duration: 5000,
                });
              }

            } else {
              Message.error({
                content: message,
                duration: 5000,
              });
            }
          });
        }
      })
    };
    /*************************************************车间调整******************************************************************************** */
    const workshop = () => {
      let arr: any = []
      gridOption.value.getSelectedRows().map((item) => {
        arr = [{id: item.id, workshop: ''}]
      })
      if (arr.length === 0) {
        Message.warning({
          content: "请选择需调整的数据",
          duration: 5000,
        });
        return;
      }
      // Modal.confirm({
      //     title: "系统提示",
      //     content: "确认选中的数据?",
      //     onOk() {
      //         post({
      //             url: "/aps/circulatCard/updateWorkshop",
      //             data: arr,
      //         }).then(({ code, data, message }: any) => {
      //             // console.log(code,"删除的状态码")
      //             if (code === 200) {
      //                 Message.success({
      //                     content: "车间调整成功",
      //                     duration: 5000,
      //                 });
      //             } else {
      //                 Message.error({
      //                     content: message,
      //                     duration: 5000,
      //                 });
      //             }
      //         });
      //     }
      // })
      cjtzZ.value = ''
      cjtzShow.value = true
    }

    const cjtzZ = ref('')

    const cjtzShow = ref(false)

    const cjtzClick = () => {
      let arr: any = []
      gridOption.value.getSelectedRows().map((item) => {
        arr = [{id: item.id, workshop: cjtzZ.value}]
      })
      post({
        url: "/aps/circulatCard/updateWorkshop",
        data: arr,
      }).then(({code, data, message}: any) => {
        if (code === 200) {
          Message.success({
            content: "车间调整成功",
            duration: 5000,
          });
          doRefresh();
          cjtzShow.value = false
        } else {
          Message.error({
            content: message,
            duration: 5000,
          });
        }
      });

    }
    /*************************************************流程调整************************************************************************************* */
    const flowPath = () => {
      let arr: any = []
      gridOption.value.getSelectedRows().map((item) => {
        pageData.flowCardCode = item.flowCardCode
        arr = [{id: item.id}]
      })
      if (arr.length === 0) {
        Message.warning({
          content: "请选择需调整的数据",
          duration: 5000,
        });
        return;
      }
      if (arr.length > 1) {
        Message.warning({
          content: "请选择一条数据进行调整",
          duration: 5000,
        });
        return;
      }

      post({
        url: "/aps/circulatCard/getCardProcessInfo",
        data: arr[0],
      }).then(({code, data, message}: any) => {
        // console.log(code,"删除的状态码")
        if (code === 200) {
          // Message.success({
          //     content: "车间调整成功",
          //     duration: 5000,
          // });
          pageData.importPath = true
          if (data.length == 0) {
            orderCustomList.flowPathList = [{
              section: null,
              process: null,
              jobMent: null,
              remark: null,
            }]
          } else {
            orderCustomList.flowPathList = data
          }
        } else {
          Message.error({
            content: message,
            duration: 5000,
          });
        }
      });
    }

    /*************************************************修改***********************************************************************************/
    const editHandler = (record: any) => {
      // initCum();
      //详情
      pageData.sideTitle = '修改资料'
      pageData.showAdd = true
    };

    /*************************************************新增************************************************************************************ */
    const router = useRouter()
    const addHandler = () => {
      router.push('/productmasterdata/order/planOrder/planOrderXin')
    }

    /************************************************待处理/已处理页签*******************************************************************************************/
    function changeGet(key: any) {
      trigger.value = key
      console.log(key)
      if (key == 0) {
        shen.value = 0
        doRefresh(shen.value)
      } else {
        shen.value = 1
        doRefresh(shen.value)
      }
    };
    /************************************************分页***********************************************************************************************/
        //页改变
    const pagingChange = (current: number) => {
          // console.log(current, "分页改变");
          pages.value = current;
          console.log(shen.value)
          doRefresh(shen.value);
        }
    //页条改变
    const pagingSizeChange = (pageSize: number) => {
      //  console.log(pageSize, "条数")
      pages.value = 1;
      paging.size = pageSize;
      doRefresh(shen.value);
    }

    /****************************************************选择日期********************************************************************************************** */
    function onSelect(dateString, date) {
      console.log('onSelect', dateString, date);
    }

    function onChange(dateString, date) {
      console.log('onChange: ', dateString, date);
      fromList.startCreateTime = dateString[0]
      fromList.endCreateTime = dateString[1]
    }

    /****************************************************选择日期********************************************************************************************** */
    function onSelectDelivery(dateString, date) {
      console.log('onSelect', dateString, date);
    }

    function onChangeDelivery(dateString, date) {
      console.log('onChange: ', dateString, date);
      fromList.startDeliveryTime = dateString[0]
      fromList.endDeliveryTime = dateString[1]
    }

    /******************************************************染整单号.客户名称.客户订单号.客订名称.订单性质下拉选查询************************************ */
        //下拉框得到焦点
    let pan = 0
    const focusSel = (value: any) => {
      let obj = {}
      switch (value) {
        case 1:
          obj = {clientDyeCode: ""}
          pan = 1
          break;
        case 2:
          obj = {customName: ''}
          pan = 2
          break;
        case 3:
          obj = {customOrderCode: ''}
          pan = 3
          break;
        case 4:
          obj = {customOrderName: ''}
          pan = 4
          break;
        case 5:
          obj = {orderNature: ''}
          pan = 5
          break;
        case 6:
          obj = {placeDepartment: ''}
          pan = 6
          break;
      }
      selCxAll(obj)
    }
    //下拉数据
    let pageDataList = ref([])
    let options = ref<any>(pageDataList.value);
    let loading = ref(false);
    const handleSearch = (value: any) => {
      let ob = {}
      switch (pan) {
        case 1:
          ob = {clientDyeCode: value}
          break;
        case 2:
          ob = {customName: value}
          break;
        case 3:
          ob = {customOrderCode: value}
          break;
        case 4:
          ob = {customOrderName: value}
          break;
        case 5:
          ob = {orderNature: value}
          break;
      }

      loading.value = true;
      selCxAll(ob);
      options.value = pageDataList.value;
      loading.value = false;
    };

    //下拉框查询
    function selCxAll(val: any) {
      post({
        url: "/aps/planOrder/getDropValue",
        data: val
      }).then(({data, code}: any) => {
        if (code === 200) {
          pageDataList.value = data;
        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });

    };

    let selectChange = () => {
    };

    /******************************************************成品布号下拉选查询*************************************************************** */
    const focusSelBh = () => {
      setCxAllBh({finishedClothCode: ''})
    };
    const handleSearchBh = (value: any) => {
      let ob = {finishedClothCode: value}
      loading.value = true;
      setCxAllBh(ob)
      options.value = pageDataList.value;
      loading.value = false;
    };

    function setCxAllBh(val: any) {
      post({
        url: "/aps/planOrder/getDropValue2",
        data: val
      }).then(({data, code}: any) => {
        if (code === 200) {
          pageDataList.value = data;
        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });
    }

    /******************************************************色号.色称.坯布编号下拉选查询************************************************************* */
    const focusSelSh = (val: any) => {
      let ob = {}
      switch (val) {
        case 1:
          ob = {colorCode: ''}
          break;
        case 2:
          ob = {colorName: ''}
          break;
        case 3:
          ob = {}
          break;
      }
      setCxAllSH(ob)

    };
    const handleSearchSh = (value: any) => {
      let ob = {greyCode: value}
      loading.value = true;
      setCxAllSH(ob)
      options.value = pageDataList.value;
      loading.value = false;
    };

    function setCxAllSH(val: any) {
      post({
        url: "/aps/planOrder/getDropValue1",
        data: val
      }).then(({data, code}: any) => {
        if (code === 200) {
          pageDataList.value = data;
        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });
    }

    /******************************************************已下流转卡号************************************************************* */
    const focusSelLz = (val: any) => {
      setCxAllLz({flowCardCode: ''})
    };

    function setCxAllLz(val: any) {
      post({
        url: "/aps/circulatCard/getDropValue",
        data: val
      }).then(({data, code}: any) => {
        if (code === 200) {
          pageDataList.value = data;
        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });
    }

    /**************************************************************************************************************************** */
    function sideaOk() {
      pageData.importAdd = false
    }

    function sideaNo() {
      pageData.importAdd = false
    }


    //刷新
    const guanxiCount = () => {
      post({
        url: "/aps/circulatCard/countInfoByCapacity",
        data: basicData.dyeList
      }).then(({data, code}: any) => {
        if (code === 200) {

        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });
    };

    /*******************************************取布号********************************************************/
    const clothCodeBoSel = () => {
      clothCodeAll({clothCode: "", auditState: 1, deleteState: 0, obsoleteState: 0})
    }
    let optionsList = ref([])
    let clothCodeList = ref<any>(optionsList.value);
    let clothCodeBo = ref(false);

    const clothCodeSearch = (value: any) => {
      const ob = {clothCode: value, auditState: 1, deleteState: 0, obsoleteState: 0}
      clothCodeBo.value = true;
      clothCodeAll(ob);
      clothCodeList.value = optionsList.value;
      clothCodeBo.value = false;
    };

    function clothCodeAll(val: any) {
      post({
        url: "/pdm/DevFabricInfo/getLikeList",
        data: val
      }).then(({data, code, message}: any) => {
        if (code === 200) {
          optionsList.value = data;
        } else {
          Message.error({
            content: message,
            duration: 5000,
          });
        }
      });
    }

    /********************************************************************取品名************************************************************************ */
    let pinList = ref([])
    const clothCodeBoSelA = () => {
      clothCodeAllA({brandName: "", auditState: 1, deleteState: 0, obsoleteState: 0})
    }
    let clothCodeListA = ref<any>(pinList.value);
    let clothCodeBoA = ref(false);

    const clothCodeSearchA = (value: any) => {
      const ob = {brandName: value, auditState: 1, deleteState: 0, obsoleteState: 0}
      clothCodeBoA.value = true;
      clothCodeAllA(ob);
      clothCodeListA.value = pinList.value;
      clothCodeBoA.value = false;
    };

    function clothCodeAllA(val: any) {
      post({
        url: "/pdm/DevFabricInfo/getLikeList",
        data: val
      }).then(({data, code, message}: any) => {
        if (code === 200) {
          pinList.value = data;
        } else {
          Message.error({
            content: message,
            duration: 5000,
          });
        }
      });
    }

    const orderCustomList = reactive({
      list: [],
      flowPathList: []
    });
    const hugeCustomer = [
      {
        headerName: 'E缸',
        field: 'circulatCard',
        pinned: 'center',
        width: 600,
        children: [
          {
            headerName: "", field: "customOrderCode",
            children: [
              {headerName: "管型", field: "customOrderCode",},

            ]
          },
          {
            headerName: "", field: "buyerName",
            children: [
              {headerName: "车间", field: "buyerName"},
            ]
          },
          {
            headerName: "6管", field: "customOrderCode",
            children: [
              {headerName: "2100", field: "customOrderCode",},
              {headerName: "1500", field: "buyerName"},
            ]
          },
          {
            headerName: "4管", field: "buyerName",
            children: [
              {headerName: "2100", field: "customOrderCode",},
              {headerName: "1500", field: "buyerName"},
            ]
          },
          {
            headerName: "3管", field: "customOrderName",
            children: [
              {headerName: "2100", field: "customOrderCode",},
              {headerName: "1500", field: "buyerName"},
            ]
          },
          {
            headerName: "2管", field: "clientDocumentary", children: [
              {headerName: "2100", field: "customOrderCode",},
              {headerName: "1500", field: "buyerName"},
            ]
          },
          {
            headerName: "1管", field: "authorizedStrengthTime", children: [
              {headerName: "2100", field: "customOrderCode",},
              {headerName: "1500", field: "buyerName"},
            ]
          },
        ]
      },

    ];
    const flowPathList = [
      // {
      //     rowHeight: 100,
      //     headerName: '',//选择列头部显示的文字，可以为空
      //     checkboxSelection: true,//设置为ture显示为复选框
      //     headerCheckboxSelection: true, //表头是否也显示复选框，全选反选用
      //     pinned: 'left', //固定再左边
      //     width: 50 //列的宽度
      // },
      {
        headerName: "工段", field: "section", width: 500,
        cellRenderer: {
          template: `
            <a-select popup-container="html" class="bacClass" :allowClear="true"
                      v-model="model.section" allow-search
                      @click="click">
              <a-option v-for="item in pageDataList" :label="item.sectionName"
                        :value="item.sectionName">{{ item.sectionName }}
              </a-option>
            </a-select>`,
          setup(props: any) {
            const pageDataList = ref([])
            const click = () => {
              post({
                url: "pdm/worksection/getFieldValue1",
                data: {
                  sectionName: ''
                }
              }).then(({data, code}: any) => {
                if (code === 200) {
                  pageDataList.value = data;
                } else {
                  Message.error({
                    content: "查询失败！",
                    duration: 5000,
                  });
                }
              });
            }
            return {
              pageDataList,
              click,
              model: props.params.data
            }
          },
        },
      },
      {
        headerName: "工序", field: "process", width: 500,
        cellRenderer: {
          template: `
            <a-select popup-container="html" class="bacClass" :allowClear="true"
                      v-model="model.process" allow-search
                      @click="click">
              <a-option v-for="item in pageDataList" :label="item.processName"
                        :value="item.processName">{{ item.processName }}
              </a-option>
            </a-select>`,
          setup(props: any) {
            const pageDataList = ref([])
            const click = () => {
              post({
                url: "pdm/worksectionWorkprocedure/getFieldValue1",
                data: {
                  processName: ''
                }
              }).then(({data, code}: any) => {
                if (code === 200) {
                  pageDataList.value = data;
                } else {
                  Message.error({
                    content: "查询失败！",
                    duration: 5000,
                  });
                }
              });
            }
            return {
              pageDataList,
              click,
              model: props.params.data
            }
          },
        },
      },
      {
        headerName: "作业性质", field: "jobMent", width: 500,
        cellRenderer: {
          template: `
            <a-select popup-container="html" class="bacClass" :allowClear="true"
                      v-model="model.jobMent" allow-search
                      @click="click">
              <a-option v-for="item in pageDataList" :label="item.flowPathType"
                        :value="item.flowPathType">{{ item.flowPathType }}
              </a-option>
            </a-select>`,
          setup(props: any) {
            const pageDataList = ref([])
            const click = () => {
              post({
                url: "pdm/FlowpathType/getFieldValue1",
                data: {
                  flowPathType: ''
                }
              }).then(({data, code}: any) => {
                if (code === 200) {
                  pageDataList.value = data;
                } else {
                  Message.error({
                    content: "查询失败！",
                    duration: 5000,
                  });
                }
              });
            }
            return {
              pageDataList,
              click,
              model: props.params.data
            }
          },
        },
      },
      {
        headerName: "备注", field: "remark", width: 500,
        cellRenderer: {
          template: `
            <a-input class="bacClass" :allowClear="true"
                     v-model="model.remark" allow-search/>`,
          setup(props: any) {

            return {
              model: props.params.data,
            }
          },
        },
      },
      {
        headerName: "操作", field: "cz", width: 150,
        cellRenderer: {
          template: `
            <a-space>
              <el-button type="warning" @click='add'>+</el-button>
              <el-button type="danger" @click='del'>-</el-button>
            </a-space>`,
          setup(props: any) {
            const add = () => {
              orderCustomList.flowPathList.splice(props.params.rowIndex + 1, 0, {
                section: null,
                process: null,
                jobMent: null,
                remark: null,
              });
              setTimeout(function () {
                gridOption2.value.setRowData(orderCustomList.flowPathList);
              }, 0)
            }
            const del = () => {
              orderCustomList.flowPathList.splice(props.params.rowIndex, 1)
              setTimeout(function () {
                gridOption2.value.setRowData(orderCustomList.flowPathList);
              }, 0)
            }
            return {
              add,
              del
            }
          },
        },
      },
      // { headerName: "生成条码" },
    ];


    const fpl: any[] = flowPathList.map((o) => {
      // if (o.headerName == '生成条码') {
      //     o['resizable'] = false
      //     o['filter'] = false
      //     o['sortable'] = false
      //     o["pinned"] = "right"
      //     o["width"] = 80
      //     o['cellRenderer'] = {
      //         template: `<el-button type='success' style='background-color: #67c23a :hover {
      //             background-color: #b3e19d;
      //         }' @click="a">生成条码</el-button>`,
      //         setup(props: any) {
      //             const a = () => {
      //                 pageData.dialogVisible = true
      //                 console.log(pageData.dialogVisible)
      //             }
      //             return {
      //                 a
      //             }
      //         }

      //     }
      // }
    })

    const hugeCustomerS = [
      {
        headerName: 'S缸',
        field: 'circulatCard',
        pinned: 'center',
        width: 600,
        children: [
          {
            headerName: "", field: "customOrderCode",
            children: [
              {headerName: "管型", field: "customOrderCode",},

            ]
          },
          {
            headerName: "", field: "buyerName",
            children: [
              {headerName: "车间", field: "buyerName"},
            ]
          },
          {
            headerName: "6管", field: "customOrderCode",
            children: [
              {headerName: "2100", field: "customOrderCode",},
              {headerName: "1500", field: "buyerName"},
            ]
          },
          {
            headerName: "4管", field: "buyerName",
            children: [
              {headerName: "2100", field: "customOrderCode",},
              {headerName: "1500", field: "buyerName"},
            ]
          },
          {
            headerName: "3管", field: "customOrderName",
            children: [
              {headerName: "2100", field: "customOrderCode",},
              {headerName: "1500", field: "buyerName"},
            ]
          },
          {
            headerName: "2管", field: "clientDocumentary", children: [
              {headerName: "2100", field: "customOrderCode",},
              {headerName: "1500", field: "buyerName"},
            ]
          },
          {
            headerName: "1管", field: "authorizedStrengthTime", children: [
              {headerName: "2100", field: "customOrderCode",},
              {headerName: "1500", field: "buyerName"},
            ]
          },
        ]
      },

    ];

    let guanxiForm = reactive({
      customOrderCode: '',
      clothCode: '',
      productName: '',
      colorCode: '',
      colorName: '',
      auditState: 0
    });


    const defaultColDefBc = {
      sortable: true,
      filter: true,
      flex: 1,
      resizable: true,
    };
    const handleClose = (done: () => void) => {

    };
    const sideaPathOk = () => {
      let ob: any = {
        id: null
      }
      ob.id = gridOption.value.getSelectedRows()[0].id
      orderCustomList.flowPathList.forEach((item: any) => {
        item.id = ob.id
      })
      // orderCustomList.flowPathList.push(ob)
      post({
        url: 'aps/circulatCard/updateCardProcess',
        data: orderCustomList.flowPathList
      }).then(({code, data, message}) => {
        if (code == 200) {
          doRefresh();
          pageData.importPath = false
          Message.success(message)
        } else {
          Message.error(message)
        }
      })
    }
    const sideaPathNo = () => {
      pageData.importPath = false
    }
    const editHandler1 = (record: any) => {
      pageData.flowCardCode = record.flowCardCode
      pageData.dialogVisible = true;

    }

    const gridOption2 = ref();
    const gridReady2 = (params: any) => {
      gridOption2.value = params.api
    }
    const localeText1: any = ref(localeText)
    return {
      localeText1,
      gridReady2,
      gridOption2,
      cjtzZ,
      cjtzClick,
      cjtzShow,
      editHandler1,
      headerShow,
      selectHandler,
      pages,
      doRefresh,
      pageData,
      paging,
      shen,
      tableCon,
      tableConA,
      billing,
      trigger,
      gridOption,
      gridReady,
      gridOptionA,
      gridReadyA,
      addHandler,
      changeGet,
      tc,
      ta,
      defaultColDef,
      editHandler,
      columnDefs,
      pagingChange,
      pagingSizeChange,
      fromList,
      basicData,
      Delete,
      Search,
      CirclePlus,
      EditPen,
      onSelect,
      onChange,
      focusSel,
      pageDataList,
      options,
      loading,
      handleSearch,
      selectChange,
      pan,
      focusSelBh,
      handleSearchBh,
      setCxAllBh,
      focusSelSh,
      handleSearchSh,
      setCxAllSH,
      focusSelLz,
      setCxAllLz,
      router,
      sideaOk,
      sideaNo,
      guanxiCount,
      clothCodeBoSel,
      optionsList,
      clothCodeList,
      clothCodeBo,
      clothCodeSearch,
      clothCodeAll,
      pinList,
      clothCodeBoSelA,
      clothCodeListA,
      clothCodeBoA,
      clothCodeSearchA,
      clothCodeAllA,
      hugeCustomer,
      orderCustomList,
      defaultColDefBc,
      clothCode,
      guanxiForm,
      hugeCustomerS,
      onSelectDelivery,
      onChangeDelivery,
      HOLDState,
      workshop,
      flowPath,
      flowPathList,
      fpl,
      handleClose,
      sideaPathOk,
      sideaPathNo
    };
  },
  components: {
    textClothRequires,
    cheCkHold,
    quickReturnState,
    cheCkTogetherState,
    cheCkBumpWhite,
    cheCKSensitiveColor,
    QrcodeVue,
    stainResistance,
    rcInfo,
    wetRubbing,
    resistanceYellow
  }
};
</script>
<style lang="less" scoped>
.pagings {
  margin-top: 10px;
  display: flex;
  justify-content: center;
}

.arco-input-wrapper {
  background-color: #fff !important;
  border: 1px solid #cccccc;
}

.arco-form-item-status-error .arco-input-wrapper:not(.arco-input-disabled),
.arco-form-item-status-error .arco-textarea-wrapper:not(.arco-textarea-disabled) {
  border: 1px solid #f53f3f;
}


/********************************************** */
.stbutencx {
  background-color: #409eff;

  &:hover {
    background-color: #79bbff;
  }
}


.ag-header-cell-resize::after {
  top: 0 !important;
  height: 100% !important;
}

.ag-cell {
  border-right: 1px solid #D9DDDF !important;
}

.stbutenxz {
  background-color: #67c23a;

  &:hover {
    background-color: #b3e19d;
  }
}

.arco-row {
  margin-bottom: 0px;
}

.ag-header-group-cell-label,
.ag-header-cell-label {
  justify-content: center !important
}

.ag-header-cell,
.ag-header-group-cell {
  border-right: 1px solid #dde2eb !important;
}

:deep(.arco-tabs) {
  height: 100%;
}

:deep(.arco-tabs-content) {
  height: 100%;
}

:deep(.arco-tabs-content-list) {
  height: 100%;
}

:deep(.arco-tabs-pane) {
  height: 100%;
}

/************************************************** */
</style>
<script setup lang="ts">
</script>